<template>
	<view>
		<view class="text-center" style="font-size: 20px">
			{{access_name}}
		</view>

		<view v-if="!is_active" class="padding text-center text-bold">
			抱歉！本出入点已关闭。
		</view>
		<view v-else-if="!check_pass" class="margin-lr">
			<!-- 检查是否是管理人员 -->
			<form @submit="formSubmit">
				<view class="cu-form-group">
					<view class="title">验证码</view>
					<input placeholder="请输入管理人员验证码" name="check_code" />
				</view>
				<button class='cu-btn bg-green block lg' form-type="submit">提交验证</button>
			</form>
		</view>
		<view v-else class="margin-lr">
			<view class="cu-bar bg-white solid-bottom margin-top">
				<view class="action">
					<text class="cuIcon-circlefill text-olive"></text> 最近出入人员：
				</view>
				<view class="action">
					<button class="cu-btn bg-green shadow" @click="loadRecord">
						刷新
					</button>
				</view>
			</view>
			<view class="cu-list menu">
				<view class="cu-item flex"
					v-for="(recordListVal, recordListIdx) in recordList"
					:key="recordListIdx">
					<view class="content">
						<view class="flex">
							<text class="cuIcon-title text-olive"></text>
							<navigator :url="'./access_record_detail?record_id='+recordListVal._id"><text class="text-sm">{{syntaxJson(recordListVal.model)}}</text></navigator>
						</view>
						<view class="flex justify-between">
							<view>登记时间：{{new Date(recordListVal.create_time).Format("MM-dd HH:mm")}}</view>
							<!-- <button class="cu-btn margin-right" @click="deleteRecord(recordListVal._id,recordListIdx)">删除</button> -->
						</view>
					</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import '@/common/js/date.js';

	export default {
		data() {
			return {
				access_id: '',
				access_name: "",
				is_active: true,
				check_pass: false,

				recordList: []
			}
		},
		onLoad() {
			this.access_id = this.$route.query.access_id;

			if (this.access_id) {
				this.getAccessDetail();
			} else {
				uni.showToast({
					icon: 'none',
					title: '出错了，请确认页面来源！',
					duration: 1000
				});
			}
		},
		methods: {
			getAccessDetail() {
				// 获得出入点详情
				uniCloud.callFunction({
					name: "ha_get_access",
					data: {
						type: 1,
						access_id: this.access_id
					},
					success: ({result}) => {
						// console.log(result)
						if ( result.status === 0 ) {
							// console.log(result.data)
							const {
								name,
								is_active
							} = result.data.self;
							this.access_name = name;
							this.is_active = is_active;
							this.recordList = result.data.record;
						} else {
							uni.showToast({
								icon: 'none',
								title: `${result.msg || "网络异常，请稍后重试！"}`,
								duration: 1000
							});
						}
					},
					fail() {
						uni.showToast({
							icon: 'none',
							title: '网络异常，请稍后重试！'
						});
					}
				});
			},
			formSubmit(e) {
				let {
					check_code
				} = e.detail.value;

				// 检查参数
				if (!check_code || !/^[0-9]+$/.test(check_code) || (check_code.length != 8)) {
					uni.showToast({
						icon: 'none',
						title: '验证码有误！'
					});
					return;
				}
				check_code = Number(check_code);

				// 检查相关信息
				uniCloud.callFunction({
					name: "ha_get_access",
					data: {
						type: 10,
						access_id: this.access_id,
						check_code
					},
					success: ({result}) => {
						// console.log(result)
						if ( result.status === 0 ) {
							this.check_pass = result.pass;
							if (this.check_pass != true) {
								uni.showToast({
									icon: 'none',
									title: '验证失败！',
									duration: 1000
								});
							}
						} else {
							uni.showToast({
								icon: 'none',
								title: `${result.msg || "网络异常，请稍后重试！"}`,
								duration: 1000
							});
						}
					},
					fail() {
						uni.showToast({
							icon: 'none',
							title: '网络异常，请稍后重试！'
						});
					}
				});
			},
			loadRecord() {
				this.recordList = [];

				uniCloud.callFunction({
					name: "ha_get2_record",
					data: {
						type: 2,
						access_id: this.access_id,
						page: 0,
						length: 20
					},
					success: ({result}) => {
						// console.log(result)
						if ( result.status === 0 ) {
							this.recordList = result.data;
						} else {
							uni.showModal({
								content: `${result.msg || "网络异常，请稍后重试！"}`,
								showCancel: false
							});
						}
					},
					fail() {
						uni.showToast({
							icon: 'none',
							title: '网络异常，请稍后重试！'
						});
					}
				});
			},
			deleteRecord(record_id,index) {
				uni.showModal({ content: '确认删除吗？', success: (res) => { if (res.confirm) {
					let token = uni.getStorageSync("token");
					let access_id = this.access_id;

					if (token) {
						uniCloud.callFunction({
							name: "ha_del_access_record",
							data: {
								token,
								access_id,
								record_id
							},
							success: ({result}) => {
								// console.log(result);
								if ( result.status === 0 ) {
									uni.showToast({
										title: `${result.msg || "删除成功！"}`,
										duration: 1000
									});
									this.recordList.splice(index, 1);
								} else {
									uni.showModal({
										content: `${result.msg || "网络异常，请稍后重试！"}`,
										showCancel: false,
										complete: function () {
											uni.navigateTo({url: "/pages/user/user_login"});
										}
									});
								}
							},
							fail() {
								uni.showToast({
									icon: 'none',
									title: '网络异常，请稍后重试！'
								});
							}
						});
					} else {
						uni.navigateTo({url: "/pages/user/user_login"});
					}
				}}});
			},
			syntaxJson(json) {
				if (typeof json !== "string") {
					json = JSON.stringify(json);
				}
				return json.replace(/\{|}/g,'').replace(/\[|]/g,'').replace(/true/,'是').replace(/false/,'否').substr(0,30);
			}
		}
	}
</script>

<style>

</style>
